<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Document</title>
    <link rel="stylesheet" href="./css/about.css" />
    <link rel="stylesheet" href="./icon/iconfont.css" />
  </head>
  <body>
    <div class="wrap">
      <header>
        <div class="logo">
          <a href="./index.html">
            <img
            src="https://www.lorealparis.com.cn/-/media/project/loreal/brand-sites/oap/shared/baseline/navigationext/loreal-paris-black-logo.svg
            alt="" />
          </a>
        </div>
        <ul class="nav">
          <li>
            <a href="">护肤</a>
            <div class="menu">
              <div class="mbox">
                <ul>
                  <li><p>按功效需求</p></li>
                  <li><a href="">柔软修护</a></li>
                  <li><a href="">蓬松补水</a></li>
                  <li><a href="">防脱强韧</a></li>
                  <li><a href="">精油</a></li>
                  <li><a href="">其他</a></li>
                </ul>
                <ul>
                  <li><p>按功效需求</p></li>
                  <li><a href="">柔软修护</a></li>
                  <li><a href="">蓬松补水</a></li>
                  <li><a href="">防脱强韧</a></li>
                  <li><a href="">精油</a></li>
                  <li><a href="">其他</a></li>
                </ul>
                <ul>
                  <li><p>按功效需求</p></li>
                  <li><a href="">柔软修护</a></li>
                  <li><a href="">蓬松补水</a></li>
                  <li><a href="">防脱强韧</a></li>
                  <li><a href="">精油</a></li>
                  <li><a href="">其他</a></li>
                </ul>
              </div>
              <div class="allmenu">
                <p>
                  <a href="./skincare.html"><span>护肤</span>所有护肤</a>
                </p>
              </div>
            </div>
          </li>
          <li>
            <a href="">彩妆</a>
            <div class="menu">
              <div class="mbox">
                <ul>
                  <li><p>脸部产品</p></li>
                  <li><a href="">柔软修护</a></li>
                  <li><a href="">蓬松补水</a></li>
                  <li><a href="">防脱强韧</a></li>
                  <li><a href="">精油</a></li>
                  <li><a href="">其他</a></li>
                </ul>
                <ul>
                  <li><p>唇部产品</p></li>
                  <li><a href="">柔软修护</a></li>
                  <li><a href="">蓬松补水</a></li>
                  <li><a href="">防脱强韧</a></li>
                  <li><a href="">精油</a></li>
                  <li><a href="">其他</a></li>
                </ul>
                <ul>
                  <li><p>眼部产品</p></li>
                  <li><a href="">柔软修护</a></li>
                  <li><a href="">蓬松补水</a></li>
                  <li><a href="">防脱强韧</a></li>
                  <li><a href="">精油</a></li>
                  <li><a href="">其他</a></li>
                </ul>
              </div>
              <div class="allmenu">
                <p>
                  <a href="./makeup.html"><span>彩妆</span>点击查看详情</a>
                </p>
              </div>
            </div>
          </li>
          <li>
            <a href="">护发</a>
            <div class="menu">
              <div class="mbox">
                <ul>
                  <li><p>按功效需求</p></li>
                  <li><a href="">柔软修护</a></li>
                  <li><a href="">蓬松补水</a></li>
                  <li><a href="">防脱强韧</a></li>
                  <li><a href="">精油</a></li>
                  <li><a href="">其他</a></li>
                </ul>
                <ul>
                  <li><p>按产品系列</p></li>
                  <li><a href="">柔软修护</a></li>
                  <li><a href="">蓬松补水</a></li>
                  <li><a href="">防脱强韧</a></li>
                  <li><a href="">精油</a></li>
                  <li><a href="">其他</a></li>
                </ul>
                <ul>
                  <li><p>按步骤</p></li>
                  <li><a href="">柔软修护</a></li>
                  <li><a href="">蓬松补水</a></li>
                  <li><a href="">防脱强韧</a></li>
                  <li><a href="">精油</a></li>
                  <li><a href="">其他</a></li>
                </ul>
              </div>
              <div class="allmenu">
                <p>
                  <a href="./wshampoo.html"><span>护发</span>所有产品</a>
                </p>
              </div>
            </div>
          </li>
          <li>
            <a href="">染发</a>
            <div class="menu">
              <div class="mbox">
                <ul>
                  <li><p>按功效需求</p></li>
                  <li><a href="">柔软修护</a></li>
                  <li><a href="">蓬松补水</a></li>
                  <li><a href="">防脱强韧</a></li>
                  <li><a href="">精油</a></li>
                  <li><a href="">其他</a></li>
                </ul>
                <ul>
                  <li><p>按潮流发色分类</p></li>
                  <li><a href="">柔软修护</a></li>
                  <li><a href="">蓬松补水</a></li>
                  <li><a href="">防脱强韧</a></li>
                  <li><a href="">精油</a></li>
                  <li><a href="">其他</a></li>
                </ul>
                <ul>
                  <li><p>按功效需求</p></li>
                  <li><a href="">柔软修护</a></li>
                  <li><a href="">蓬松补水</a></li>
                  <li><a href="">防脱强韧</a></li>
                  <li><a href="">精油</a></li>
                  <li><a href="">其他</a></li>
                </ul>
              </div>
              <div class="allmenu">
                <p>
                  <a href="./tint.html"><span>在线试色</span>所有护发</a>
                </p>
              </div>
            </div>
          </li>
          <li>
            <a href="">男士护发</a>
            <div class="menu">
              <div class="mbox">
                <ul>
                  <li><p>按功效需求</p></li>
                  <li><a href="">柔软修护</a></li>
                  <li><a href="">蓬松补水</a></li>
                  <li><a href="">防脱强韧</a></li>
                  <li><a href="">精油</a></li>
                  <li><a href="">其他</a></li>
                </ul>
                <ul>
                  <li><p>按功效需求</p></li>
                  <li><a href="">柔软修护</a></li>
                  <li><a href="">蓬松补水</a></li>
                  <li><a href="">防脱强韧</a></li>
                  <li><a href="">精油</a></li>
                  <li><a href="">其他</a></li>
                </ul>
                <ul>
                  <li><p>按功效需求</p></li>
                  <li><a href="">柔软修护</a></li>
                  <li><a href="">蓬松补水</a></li>
                  <li><a href="">防脱强韧</a></li>
                  <li><a href="">精油</a></li>
                  <li><a href="">其他</a></li>
                </ul>
              </div>
              <div class="allmenu">
                <p>
                  <a href="./mhair.html"><span>男士护发</span>所有产品</a>
                </p>
              </div>
            </div>
          </li>
          <li>
            <a href="">男士造型</a>
            <div class="menu">
              <div class="mbox">
                <ul>
                  <li><p>按功效需求</p></li>
                  <li><a href="">柔软修护</a></li>
                  <li><a href="">蓬松补水</a></li>
                  <li><a href="">防脱强韧</a></li>
                  <li><a href="">精油</a></li>
                  <li><a href="">其他</a></li>
                </ul>
                <ul>
                  <li><p>按功效需求</p></li>
                  <li><a href="">柔软修护</a></li>
                  <li><a href="">蓬松补水</a></li>
                  <li><a href="">防脱强韧</a></li>
                  <li><a href="">精油</a></li>
                  <li><a href="">其他</a></li>
                </ul>
                <ul>
                  <li><p>按功效需求</p></li>
                  <li><a href="">柔软修护</a></li>
                  <li><a href="">蓬松补水</a></li>
                  <li><a href="">防脱强韧</a></li>
                  <li><a href="">精油</a></li>
                  <li><a href="">其他</a></li>
                </ul>
              </div>
              <div class="allmenu">
                <p>
                  <a href="./profiling.html"><span>男士造型</span>所有产品</a>
                </p>
              </div>
            </div>
          </li>
          <li>
            <a href="">男士护肤</a>
            <div class="menu">
              <div class="mbox">
                <ul>
                  <li><p>按功效需求</p></li>
                  <li><a href="">柔软修护</a></li>
                  <li><a href="">蓬松补水</a></li>
                  <li><a href="">防脱强韧</a></li>
                  <li><a href="">精油</a></li>
                  <li><a href="">其他</a></li>
                </ul>
                <ul>
                  <li><p>按功效需求</p></li>
                  <li><a href="">柔软修护</a></li>
                  <li><a href="">蓬松补水</a></li>
                  <li><a href="">防脱强韧</a></li>
                  <li><a href="">精油</a></li>
                  <li><a href="">其他</a></li>
                </ul>
                <ul>
                  <li><p>按功效需求</p></li>
                  <li><a href="">柔软修护</a></li>
                  <li><a href="">蓬松补水</a></li>
                  <li><a href="">防脱强韧</a></li>
                  <li><a href="">精油</a></li>
                  <li><a href="">其他</a></li>
                </ul>
              </div>
              <div class="allmenu">
                <p>
                  <a href="./product.html"><span>护发</span>所有护发</a>
                </p>
              </div>
            </div>
          </li>
          <li>
            <a href="">男士彩妆</a>
            <div class="menu">
              <div class="mbox">
                <ul>
                  <li><p>按功效需求</p></li>
                  <li><a href="">柔软修护</a></li>
                  <li><a href="">蓬松补水</a></li>
                  <li><a href="">防脱强韧</a></li>
                  <li><a href="">精油</a></li>
                  <li><a href="">其他</a></li>
                </ul>
                <ul>
                  <li><p>按功效需求</p></li>
                  <li><a href="">柔软修护</a></li>
                  <li><a href="">蓬松补水</a></li>
                  <li><a href="">防脱强韧</a></li>
                  <li><a href="">精油</a></li>
                  <li><a href="">其他</a></li>
                </ul>
                <ul>
                  <li><p>按功效需求</p></li>
                  <li><a href="">柔软修护</a></li>
                  <li><a href="">蓬松补水</a></li>
                  <li><a href="">防脱强韧</a></li>
                  <li><a href="">精油</a></li>
                  <li><a href="">其他</a></li>
                </ul>
              </div>
              <div class="allmenu">
                <p>
                  <a href=""><span>护发</span>所有护发</a>
                </p>
              </div>
            </div>
          </li>
          <li><a href="">BEAUTY MAGAZINE</a></li>
        </ul>
        <div class="serch">
          <button><i class="iconfont">&#xe600;</i></button>
          <form action="">
            <input type="text" placeholder="请输入你想寻找的内容" />
            <i class="iconfont" id="close">&#xe659;</i>
            <i class="iconfont" id="serchipt">&#xe600;</i>
          </form>
        </div>
      </header>
      <main>
        <div class="filterheader">
          <div class="title">
            <h1>关于我们</h1>
          </div>
        </div>
        <div class="introduce">
          <div class="content">
            <h1>“从指尖到发稍” 的美丽</h1>
            <h1>巴黎欧莱雅，你值得拥有！</h1>
            <p>
              承袭高雅的法兰西浪漫气质，迈着新锐科技专业护肤的脚步，巴黎欧莱雅，牵手“星”光万丈的全球当红明星，沿着多元文化的王者之路，穿越一个百年的世纪“光阴隧道”，构造出至尊科技的美容“巴比伦王国”。一百多年来，巴黎欧莱雅在美的领域里不断改造和引领着全世界消费者的方式和观念，不断刷新和引领着“从指尖到发梢”的美丽。科技与美，始终相伴相生，互为激荡。
            </p>
          </div>
          <div class="image"></div>
          <div class="content">
            <h1>从染发剂起家</h1>
            <p>
              1907年，年仅28岁的欧仁·舒莱尔发明出一种无毒的合成染发剂，并命名为欧莱雅（L’Oreal）。在那之后的100多年里，世界变迁，巴黎欧莱雅却未停止过科研与创新的步伐，不断锐意进取，如今，巴黎欧莱雅的产品已从染发剂扩展到女士护肤、彩妆、女士洗护发、家用染发、男士护肤、男士洗发及造型等诸多领域，全方位带来“从指尖到发稍”的美丽。
            </p>
          </div>
          <div class="content">
            <h1>“梦之队”明星诠释深层内涵</h1>
            <p>
              巴黎欧莱雅在全世界范围选择最具魅力的明星，组成“梦之队”，从各个不同的角度来讲述“巴黎欧莱雅美丽无疆界”的气势，并使“巴黎欧莱雅，你值得拥有”的美丽概念成为一种经典！简•方达(Jane
              Fonda)、伊娃•朗格利亚(Eva Longoria)、朱利安•摩尔(Julianne
              Moore)、艾丽•范宁(Elle Fanning)、海伦•米伦(Helen
              Mirren)、巩俐、李宇春、吴彦祖……每一位巴黎欧莱雅品牌代言人都拥有卓尔不群的事业和魅力非凡的个性，完美诠释了“你值得拥有”这一品牌理念，40多年来，这句话被翻译成各种语言，鼓励全球不同肤色、不同年龄、不同背景的女性，去追求值得拥有的人生，去创造值得拥有的美！
            </p>
            <p>
              美是没有疆界的，巴黎欧莱雅希望把美的产品和美的文化、艺术、历史和科学带给全世界的人们，也正是基于对美的这种理解，巴黎欧莱雅在全球范围内积极支持赞助各种文化艺术与科学活动，为文化的繁荣、科技的振兴作出自己的努力，而积极支持戛纳国际电影节的举办、支持电影人、推动电影行业的发展正是表现了巴黎欧莱雅对文化艺术事业的投入与贡献。自1998年起，巴黎欧莱雅正式成为戛纳国际电影节的官方指定合作伙伴，并为其代言人和世界知名人士打造闪耀夺目的造型，向电影和美致敬；每年的戛纳电影节也都为巴黎欧莱雅提供全新的机会，展示其品质卓越、工艺超凡、高性价比的产品。
            </p>
          </div>
          <div class="image"></div>
          <div class="content">
            <h1>科研力量引领美丽新潮流</h1>
            <p>
              巴黎欧莱雅在全球不同地区拥有一流的研发与创新中心，专门研究适合不同地区消费者肌肤的产品。巴黎欧莱雅的每一个产品都从科技创新中汲取精华，让世界女性享受高科技、高质量、安全可靠的化妆品。无论是哪种肌肤，哪种年龄，巴黎欧莱雅都带给你看得见的美丽。
            </p>
            <p>
              在追求带来高品质产品的同时，巴黎欧莱雅始终贯彻执行企业社会责任（CSR）政策。自1989年开始，巴黎欧莱雅便开始采用人造皮肤模型进行产品的研发和测试，这款人造皮肤模型汇聚了欧莱雅30年的生物组织工程科学研究与专业知识，是了解肌肤生态深层机制的宝贵工具，同时不用伤害任何一条鲜活生命。
            </p>
          </div>
          <div class="image"></div>
          <div class="content">
            <h1>触手可及的奢华，你值得拥有</h1>
            <p>
              融合了巴黎浪漫之都的典雅以及流行时尚的特色，结合美丽与尖端科技，巴黎欧莱雅不断创新，引领潮流，令人赞叹！它是全球女性都翘首以盼的美发、美容专家。正如1971年，巴黎欧莱雅在L'Oréal
              Préférence
              的染发产品美国版广告中所言，“我使用最昂贵的染发剂，因为我值得拥有。”登上五大洲的巴黎欧莱雅品牌，从此以20种不同的语言喊出一个声音，“巴黎欧莱雅，你值得拥有”。只有尊重每一个人的选择，才能演化出纷繁多元之美。
            </p>
          </div>
        </div>
      </main>
      <footer>
        <div class="footer-content">
          <div class="content">
            <div class="row">
              <p>More to Explore</p>
              <ul>
                <li><a href="./about.html">关于我们</a></li>
                <li><a href="">查看所有内容</a></li>
              </ul>
            </div>
            <div class="row website">
              <p>Social</p>
              <ul>
                <li>
                  <i class="iconfont">&#xe601;</i
                  ><a href="">巴黎欧莱雅官方微博</a>
                </li>
                <li>
                  <i class="iconfont">&#xe601;</i
                  ><a href="">欧莱雅美发官方微博</a>
                </li>
                <li>
                  <i class="iconfont">&#xe601;</i
                  ><a href="">巴黎欧莱雅男士官方微博</a>
                </li>
              </ul>
            </div>
          </div>
          <div class="remind">
            <p>
              国家药监局提示您：请正确认识化妆品功效，化妆品不能代替药品，不能治疗皮肤病等疾病
            </p>
          </div>
        </div>
        <div class="policy">
          <img
            src="https://ccx-work-1317399396.cos.ap-guangzhou.myqcloud.com/footer_map.png"
            alt=""
          />
          <ul class="ordinance">
            <li><a href="">Cookies政策</a></li>
            <li><a href="">隐私政策</a></li>
            <li><a href="">使用条款</a></li>
            <li>@ 2022 L'Oréal Paris</li>
          </ul>
        </div>
        <div class="call">
          <p>
            欧莱雅客户关怀中心：400-821-5098 会员积分兑礼服务热线：400-821-5098
            欧莱雅中国有限公司地址：上海市静安区南京西路1601号
          </p>
        </div>
        <div class="bottom">
          <div class="bottom-content">
            <span>沪公网安备 31010602001554号</span>
            <span>中国工商 沪ICP备08100043号-32</span>
          </div>
        </div>
      </footer>
    </div>
    <script src="./js/axios.js"></script>
    <script type="module" src="./js/about.js"></script>
  </body>
</html>
